<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./html/01.html">
    <!-- <link rel="stylesheet" href="../src/sass/"> -->
    <link rel="stylesheet" href="../dist/css/index.min.css">
    <link rel="stylesheet" href="../dist/css/css.min.css">
    <link rel="stylesheet" href="../dist/css/dingbu.min.min.css">
    <link rel="stylesheet" href="../dist/css/swiper-bundle.min.min.css">
    <link rel="stylesheet" href="../dist/css/pinpai.min.css">
    <script src="./js/jquery.js"></script>
    <script src="./js/js.js"></script>
</head>
<script type="text/javascript">

    $(document).ready(function () {

        $(".area").hover(function () {

            $(this).find(".qq").show(100);
        }

            , function () {

                $(this).find(".qq").hide(100);

            });

    });

</script>

<body>
    <div class="top">
        <div class="zishiy1">
            <ul class="left-content">
                <a href="javascript:;">关注</a>
                <a href="javascriot:;" class="left-content-a">下载APP</a>
            </ul>
         
            <ul class="right-content">
                <li class="right-content-1" id="header">
                    <a href="./html/login.html">登录</a>
                    &nbsp;&nbsp;&nbsp;&nbsp;
                    <a href="./html/signup.html">注册</a>
                </li>
                <li class="right-content-2">
                    <span>💝</span>
                    <a href="javascript:;">收藏</a>
                </li>
                <li class="right-content-3">
                    &#128545
                    <a href="./html/cart.html">购物袋</a>
                </li>
                <li class="right-content-4">
                    <a href="javascript:;">公告</a>
                </li>
            </ul>
    
            <div class="footer">
    
            </div>
            <!-- 导航start -->
            <div class="logo-container">
                <div class="header-logo">
                    <a href="">
                        <img src="./img/logo.png" alt="">
                        
                    </a>
                </div>
                <!-- 吸顶 -->
                <nav id="nav" style="z-index:100">
                    <ul id="wsx">
                        <li id="nav_logo" class="item-first">
                            <a href="">
                                <img src="./img/logo.png" width="60" height="38">
                            </a>
                        </li>
                        <li class="item">
                            <a href="" target="_blank">
                                首页
                            </a>
                            <ul class="xiala">
                                <li>
                                    首页
                                </li>
                            </ul>
                        </li>
                        <li class="item">
                            <a href="./html/list.html" target="_blank">
                                女鞋
                            </a>
                            <ul class="xiala">
                                <li>
                                    首页
                                </li>
                            </ul>
                        </li>
                        <li class="item">
                            <a href="" target="_blank">
                                男鞋
                            </a>
                            <ul class="xiala">
                                <li>
                                    首页
                                    <a href=""></a>
                                </li>
                            </ul>
                        </li>
                        <li class="item">
                            <a href="" target="_blank">
                                运动
                            </a>
                            <ul class="xiala">
                                <li>
                                    首页
                                </li>
                            </ul>
                        </li>
                        <li class="item">
                            <a href="" target="_blank">
                                户外
                            </a>
                            <ul class="xiala">
                                <li>
                                    首页
                                </li>
                            </ul>
                        </li>
                        <li class="item">
                            <a href="" target="_blank">
                                儿童
                            </a>
                            <ul class="xiala">
                                <li>
                                    首页
                                </li>
                            </ul>
                        </li>
                        <li class="item">
                            <a href="" target="_blank">
                                箱包
                            </a>
                            <ul class="xiala">
                                <li>
                                    首页
                                </li>
                            </ul>
                        </li>
                    </ul>
                   
                    <div class="search-wrapper">
                        <form action="//www.yougou.com/sr/searchKey.sc " class="input_box"
                            onsubmit="if(keyword.value==''){return false;}" id="J_TopSearchForm" method="get">
                            <div class="search">
                                <input type="text" id="keyword" name="keyword" autocomplete="off">
                                <a href="">
                                <input id="btn-search" class="icon bg-Details_page_enlarge">
                            </a>
                            </div>
                        </form>
                    </div>
                </nav>
                <script>
                    o_box = document.getElementById('nav');
    
                    window.onscroll = function () {
                        var scroll_top = Math.floor(document.documentElement.scrollTop || document.body.scrollTop)
                        if (scroll_top > 100) {
                            o_box.style.position = 'fixed';
                            o_box.style.top = '0px'
                        } else {
                            o_box.style.position = 'relative';
                        }
                    }
                
                </script>
                <!-- <div class="content-nav"> -->
                <!-- 轮播图 -->
                <div class="area" style="z-index: 1;">
                    <a id=prev class="prevBtn qq" href="javascript:void(0)"></a>
                    <a id=next class="nextBtn qq" href="javascript:void(0)"></a>
                    <div id=js class="js">
                        <div class="box01">
                            <img src="./img/lb.jpg">
                            <img style="DISPLAY: none" src="./img/lb2.jpg">
                        </div>
                        <div class="bg"></div>
                        <div id=jsNav class=jsNav>
                            <a class="trigger imgSelected" href="javascript:void(0)">1</a>
                            <a class="trigger" href="javascript:void(0)">2</a>
                        </div>
                    </div>
                   
                </div>
                <!-- 新品推荐 -->
                <div class="products">
                    <div class="products-title">新品推荐</div>
                    <div class="products-tabs">
                        <a href="">男女鞋</a>
                        <a href="">运动</a>
                    </div>
                    <!-- Swiper -->
                    <div class="swiper mySwiper">
                        <div class="swiper-wrapper" style="margin: 0;">
                            <div class="swiper-slide">
                                <img src="./img/01.jpg" alt="" class="con1-img1">
                                <img src="./img/001.png" alt="" class="con1-img2">
                                <div class="con1-div1">英伦 短靴</div>
                                <div class="con1-div2">￥ 593</div>
                            </div>
                            <div class="swiper-slide">
                                <img src="./img/02.jpg" alt="" class="con1-img1">
                                <img src="./img/001.png" alt="" class="con1-img2">
                                <div class="con1-div1">英伦 短靴</div>
                                <div class="con1-div2">￥ 593</div>
                            </div>
                            <div class="swiper-slide">
                                <img src="./img/03.jpg" alt="" class="con1-img1">
                                <img src="./img/001.png" alt="" class="con1-img2">
                                <div class="con1-div1">英伦 短靴</div>
                                <div class="con1-div2">￥ 593</div>
                            </div>
                            <div class="swiper-slide">
                                <img src="./img/01.jpg" alt="" class="con1-img1">
                                <img src="./img/001.png" alt="" class="con1-img2">
                                <div class="con1-div1">英伦 短靴</div>
                                <div class="con1-div2">￥ 593</div>
                            </div>
                            <div class="swiper-slide">
                                <img src="./img/02.jpg" alt="" class="con1-img1">
                                <img src="./img/001.png" alt="" class="con1-img2">
                                <div class="con1-div1">英伦 短靴</div>
                                <div class="con1-div2">￥ 593</div>
                            </div>
                            <div class="swiper-slide">
                                <img src="./img/03.jpg" alt="" class="con1-img1">
                                <img src="./img/001.png" alt="" class="con1-img2">
                                <div class="con1-div1">英伦 短靴</div>
                                <div class="con1-div2">￥ 593</div>
                            </div>
                        </div>
                        <div class="swiper-button-next"></div>
                        <div class="swiper-button-prev"></div>
                    </div>
    
                    <!-- Swiper JS -->
                    <script src="./js/swiper-bundle.min.js"></script>
                    
    
                    <!-- Initialize Swiper -->
                    <script>
                        var swiper = new Swiper(".mySwiper", {
                            slidesPerView: 4,
                            // spaceBetween: 30,
                            slidesPerGroup: 4,
                            loop: true,
                            loopFillGroupWithBlank: true,
                            pagination: {
                                el: ".swiper-pagination",
                                clickable: true,
                            },
                            navigation: {
                                nextEl: ".swiper-button-next",
                                prevEl: ".swiper-button-prev",
                            },
                        });
                    </script>
                </div>
                <!-- 今日主推大牌 -->
                <div class="products">
                    <div class="products-title">今日主推大牌</div>
                    <div class="products-tabs">
                        <a href="">男女鞋</a>
                        <a href="">运动</a>
                    </div>
                    <div class="products-mask">
                        <div class="zz">
                            <img src="./img/zz.jpg" alt="">
                            <div class="zzc"></div>
                        </div>
                        <div class="zz">
                            <img src="./img/zz2.jpg" alt="">
                            <div class="zzc"></div>
                        </div>
                        <div class="zz">
                            <img src="./img/zz3.jpg" alt="">
                            <div class="zzc"></div>
                        </div>
                    </div>
                    <!-- Swiper -->
                    <div class="swipe mySwipe">
                        <div class="swipe-wrapper">
                            <div class="swipe-slide"><img src="./img/blackL-adidasneo.png" alt=""></div>
                            <div class="swipe-slide"><img src="./img/blackL-asics.png" alt=""></div>
                            <div class="swipe-slide"><img src="./img/blackL-basto.png" alt=""></div>
                            <div class="swipe-slide"><img src="./img/blackL-bata.png" alt=""></div>
                            <div class="swipe-slide"><img src="./img/blackL-adidasneo.png" alt=""></div>
                            <div class="swipe-slide"><img src="./img/blackL-asics.png" alt=""></div>
                            <div class="swipe-slide"><img src="./img/blackL-basto.png" alt=""></div>
                            <div class="swipe-slide"><img src="./img/blackL-bata.png" alt=""></div>
                            <div class="swipe-slide"><img src="./img/blackL-adidasneo.png" alt=""></div>
                            <div class="swipe-slide"><img src="./img/blackL-asics.png" alt=""></div>
                            <div class="swipe-slide"><img src="./img/blackL-basto.png" alt=""></div>
                            <div class="swipe-slide"><img src="./img/blackL-bata.png" alt=""></div>
                        </div>
                        <div class="swiper-button-next"></div>
                        <div class="swiper-button-prev"></div>
                    </div>
    
                    <!-- Swiper JS -->
                    <script src="../dist/js/pinpai.min.js"></script>
                    <script src="../dist/js/cooke.min.js"></script>
                    <script src="./js/index.js"></script>
    
                    <!-- Initialize Swiper -->
                    <script>
                        var swiper = new Swiper(".mySwipe", {
                            slidesPerView: 10,
                            slidesPerGroup: 10,
                            loop: true,
                            loopFillGroupWithBlank: true,
                            pagination: {
                                el: ".swipe-pagination",
                                clickable: true,
                            },
                            navigation: {
                                nextEl: ".swiper-button-next",
                                prevEl: ".swiper-button-prev",
                            },
                        });
                    </script>
                </div>
                <!-- 品牌潮流 -->
                <div class="products">
                    <div class="products-title">品牌潮流</div>
                    <div class="products-tabs">
                        <a href="">BRAND FASHION</a>
                    </div>
                    <div class="products-mask">
                        <video poster="./img/zz.jpg"
                            src="http://i1.ygimg.cn/pics/shop/cms/advertising_video/bai_li_SS19shu_ban_30s_1080X1920~1.mp4"
                            controls=" "></video>
                        <video poster="./img/zz2.jpg"
                            src="http://i1.ygimg.cn/pics/shop/cms/advertising_video/bai_li_SS19shu_ban_30s_1080X1920~1.mp4"
                            controls=" "></video>
                        <video poster="./img/zz3.jpg"
                            src="http://i1.ygimg.cn/pics/shop/cms/advertising_video/bai_li_SS19shu_ban_30s_1080X1920~1.mp4"
                            controls=" "></video>
                    </div>
                    <div class="products-brand">
                        <div class="zz1">
                            <img src="./img/3.jpg" alt="">
                            <div class="zzc1">复古百搭乐福鞋</div>
                        </div>
                        <div class="zz1">
                            <img src="./img/4.jpg" alt="">
                            <div class="zzc1">长腿神器超酷靴</div>
                        </div>
                        <div class="zz1">
                            <img src="./img/3.jpg" alt="">
                            <div class="zzc1">赚足回头率</div>
                        </div>
                        <div class="zz1">
                            <img src="./img/4.jpg" alt="">
                            <div class="zzc1">你的酷男孩已上线</div>
                        </div>
                    </div>
                    <div class="products-pub">
                        <video poster="./img/lb2.jpg"
                            src="http://i1.ygimg.cn/pics/shop/zhu_zhan/cyn/advertising_video_basto_2021.mp4"
                            controls=""></video>
                    </div>
                    <div class="products-ckg">
                        <a href="">
                            <img src="./img/datu.jpg" alt="">
                        </a>
                    </div>
                </div>
        </div>
        
      
        </div>
        <!-- 底部 -->
    <div class="zishiy3">
        <div class="hengxian"></div>
        <div class="zishiy2">
            <div class="sale">
                <ul>
                    <li>正品保证</li>
                    <li>10天退换货</li>
                    <li>10天调补差价额</li>
                    <li>9：00-21：00在线客服</li>
                </ul>
            </div>
    
            <div class="buttom">
                <div class="buttom-area">
                    <ul>
                        <li>
                            <dl>
                                <dt style="color: white;">
                                    新手帮助
                                <dd class="dd1">交易条款协议</dd>
                                <dd class="dd1">注册新用户</dd>
                                <dd class="dd1">会员积分详情</dd>
                                <dd class="dd1">隐私条款</dd>
                                </dt>
                            </dl>
                        </li>
                        <li>
                            <dl>
                                <dt>
                                <dd class="dd2" style="margin-top: 35px;">交易条款协议</dd>
                                <dd class="dd2">注册新用户</dd>
                                <dd class="dd2">会员积分详情</dd>
                                <dd class="dd2">隐私条款</dd>
                                </dt>
                            </dl>
                        </li>
                        <li>
                            <dl>
                                <dt>
                                <dd class="dd2" style="margin-top: 35px;">交易条款协议</dd>
                                <dd class="dd2">注册新用户</dd>
                                <dd class="dd2">会员积分详情</dd>
                                <dd class="dd2">隐私条款</dd>
                                </dt>
                            </dl>
                        </li>
                        <li>
                            <dl>
                                <dt>
                                <dd class="dd2" style="margin-top: 35px;">交易条款协议</dd>
                                <dd class="dd2">注册新用户</dd>
                                <dd class="dd2">会员积分详情</dd>
                                <dd class="dd2">隐私条款</dd>
                                </dt>
                            </dl>
                        </li>
                        <li>
                            <dl>
                                <dt>
                                <dd class="dd2" style="margin-top: 35px;">交易条款协议</dd>
                                <dd class="dd2">注册新用户</dd>
                                <dd class="dd2">会员积分详情</dd>
                                <dd class="dd2">隐私条款</dd>
                                </dt>
                            </dl>
                        </li>
                        <li>
                            <dl>
                                <dt>
                                <dd class="dd2" style="margin-top: 35px;">交易条款协议</dd>
                                <dd class="dd2">注册新用户</dd>
                                <dd class="dd2">会员积分详情</dd>
                                <dd class="dd2">隐私条款</dd>
                                </dt>
                            </dl>
                        </li>
                    </ul>
                </div>
                <div class="buttom-code">
                    <ul class="content-item">
                        <li>
                            <a href="">
                                <img src="./img/beian1.png" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <img src="./img/beian2.png" alt="">
                            </a>
                        </li>
                    </ul>
                    <ul class="content-code">
                        <li style=" margin-left: 300px;">
                            <a href="">
                                <img src="./img/app.jpg" alt="">
                                <span style="text-align:center ;">扫描手机客户端</span>
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <img src="./img/app.jpg" alt="">
                                <span style="text-align:center ;">扫描手机客户端</span>
                            </a>
                        </li>
                    </ul>
                </div>
                <ul class="butom-link">
                    <li>
                        关于选购
                        &emsp; |
                    </li>
                    <li>
                        关于选购
                        &emsp; |
                    </li>
                    <li>
                        关于选购
                        &emsp;|
                    </li>
                    <li>
                        关于选购
                        &emsp; |
                    </li>
                    <li>
                        关于选购
                        &emsp;|
                    </li>
                    <li>
                        关于选购
                    </li>
                </ul>
                <div style="color: azure; margin-left:30px;">Copyright © 2011-2016 Yougou Technology Co., Ltd.
                    粤ICP备09070608号 深公网安备：4403101910665 粤公网安备 44030502000017号</div>
            </div>
        </div>
    </div>
    </div>
    </div>
</body>

</html>